<template>
  <div id="app">
    <div id="nav">
      <button @click="showWin = true">打开窗口</button>
    </div>
    <LightWin
      v-if="showWin"
      v-model="showWin"
      width="200"
      height="200"
      borderRadius="6"
      title="I'm ikun"
    >
      <h1>test</h1>
      <h1>
        {{ testBoolean ? "开启" : "关闭" }}
      </h1>
      <button @click="testBoolean = !testBoolean">测试按钮</button>
      <LightWin
        v-if="testBoolean"
        v-model="testBoolean"
        :icon="false"
        title="你干嘛,哎哟~"
      />
    </LightWin>
  </div>
</template>
<script>
import LightWin from "@/views/LightWin/index.vue";
export default {
  components: {
    LightWin,
  },
  data() {
    return {
      showWin: false,
      testBoolean: false,
    };
  },
};
</script>
<style lang="less">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

#nav {
  padding: 30px;

  a {
    font-weight: bold;
    color: #2c3e50;

    &.router-link-exact-active {
      color: #42b983;
    }
  }
}
</style>
